import React, {Component} from 'react';
import {
  View,
  Text,
  Alert,
  Button,
  ToastAndroid,
  TextInput,
  StyleSheet,
  Dimensions,
  TouchableOpacity,
  ScrollView,
  Image,
  Linking,
} from 'react-native';
import Avatar from '../Avatar/index';
// import {getData} from '../../../../../gene/src/storage';
let widthScreen = Dimensions.get('window').width;
let heightScreen = Dimensions.get('window').height;
export default class Proposal extends Component {
  static defaultProps = {
    title: '',
    stage: 0,
    deadline: 'aaa',
    proposerUID: '',
    proposerAvatarUrl: 'empty',
    executorUid: '',
    executorAvatarUrl: 'empty',
  };
  constructor(props) {
    super(props);

    this.state = {
      title: this.props.title,
      stage: this.props.stage,
      subtitle: '提案基础信息',
    };
  }
  downloadProposalFile(url) {
    //alert("ok");
    Linking.canOpenURL(url)
      .then(supported => {
        if (!supported) {
          //alert("出问题了！");
          console.log("Can't handle url: " + url);
        } else {
          //alert(url);
          return Linking.openURL(url);
        }
      })
      .catch(err => console.error('An error occurred', err));
  }
  componentDidMount(): void {}

  /*changeSubtitle() {
              if(this.props.stage === 1) {
                  this.setState({
                      subtitle: '正在征集联名'
                  })
              }
              else if(this.props.stage === 2) {
                  this.setState({
                      subtitle: '正在进行表决'
                  })
              }
              //TODO：执行于验收的标志
              else if(this.props.stage === 3) {
                  this.setState({
                      subtitle: '正在执行提案'
                  })
              }
              else if(this.props.stage === 4){
                  this.setState({
                      subtitle: '提案验收完成'
                  })
              }
          }*/

  jumpToOtherInfo(uid) {
    this.props.navigation.navigate('ShowOtherInfo', {
      uid: uid,
    });
  }
  render() {
    //TODO 如果还没有fetch完成，让他显示一个空的view
    // if (this.state.isLoading) {
    //   return <View />;
    // }
    //TODO:proposal控件的render函数
    return (
      <View
        style={{
          marginTop: heightScreen * 0.009,
          height: heightScreen * 0.369,
          backgroundColor: '#FFFFFF',
        }}>
        <View
          style={{
            marginTop: 0.016 * heightScreen,
            marginLeft: widthScreen * 0.053,
            flexDirection: 'row',
          }}>
          <View
            style={{
              marginTop: heightScreen * 0.002,
              width: widthScreen * 0.021,
              height: heightScreen * 0.038,
              backgroundColor: '#3399FF',
            }}
          />
          <View>
            <Text
              style={{
                marginTop: heightScreen * 0.003,
                marginLeft: widthScreen * 0.012,
                fontSize: heightScreen * 0.026,
                color: '#000000',
                //fontFamily: 'MicrosoftYaHei',
                fontWeight: '400',
              }}>
              {this.props.title}
            </Text>
            <View
              style={{
                marginLeft: widthScreen * 0.011,
                height: 1.5,
                width: widthScreen * 0.573,
                backgroundColor: '#6B97FF',
              }}
            />
          </View>
        </View>
        {/*this.changeSubtitle()*/}
        <Text
          style={{
            marginLeft: widthScreen * 0.048,
            color: '#3399FF',
            fontSize: heightScreen * 0.018,
            //fontFamily: 'MicrosoftYaHei',
          }}>
          {this.state.subtitle}
        </Text>
        <View style={{height: heightScreen * 0.025}} />
        <Text
          style={{
            marginLeft: widthScreen * 0.048,
            color: '#333333',
            fontSize: heightScreen * 0.018,
            //fontFamily: 'MicrosoftYaHei',
          }}>
          提案文档查看
        </Text>
        <View style={{height: heightScreen * 0.003}} />
        <TouchableOpacity
          style={{width: widthScreen * 0.753}}
          onPress={() => this.downloadProposalFile(this.props.proposalUrl)}>
          <View
            style={{
              marginLeft: widthScreen * 0.053,
              width: widthScreen * 0.72,
              height: heightScreen * 0.131,
              borderWidth: 0.8,
              borderColor: '#3399FF',
            }}>
            <View
              style={{flexDirection: 'row', marginTop: heightScreen * 0.013}}>
              <View
                style={{
                  width: heightScreen * 0.058,
                  height: heightScreen * 0.075,
                  backgroundColor: '#6B97FF',
                  marginLeft: widthScreen * 0.051,
                }}>
                <View
                  style={{
                    width: heightScreen * 0.014,
                    height: heightScreen * 0.014,
                    borderTopColor: '#FFFFFF',
                    borderTopWidth: heightScreen * 0.007,
                    borderRightColor: '#6B97FF',
                    borderRightWidth: heightScreen * 0.007,
                    borderBottomColor: '#6B97FF',
                    borderBottomWidth: heightScreen * 0.007,
                    borderLeftColor: '#FFFFFF',
                    borderLeftWidth: heightScreen * 0.007,
                  }}
                />
                <View
                  style={{
                    width: heightScreen * 0.034,
                    height: heightScreen * 0.0008,
                    marginLeft: heightScreen * 0.012,
                    marginTop: heightScreen * 0.004,
                    marginBottom: heightScreen * 0.0085,
                    backgroundColor: '#FFFFFF',
                  }}
                />
                <View
                  style={{
                    width: heightScreen * 0.034,
                    height: heightScreen * 0.0008,
                    marginLeft: heightScreen * 0.012,
                    marginTop: heightScreen * 0.004,
                    marginBottom: heightScreen * 0.0085,
                    backgroundColor: '#FFFFFF',
                  }}
                />
                <View
                  style={{
                    width: heightScreen * 0.034,
                    height: heightScreen * 0.0008,
                    marginLeft: heightScreen * 0.012,
                    marginTop: heightScreen * 0.004,
                    marginBottom: heightScreen * 0.0085,
                    backgroundColor: '#FFFFFF',
                  }}
                />
                <View
                  style={{
                    width: heightScreen * 0.034,
                    height: heightScreen * 0.0008,
                    marginLeft: heightScreen * 0.012,
                    marginTop: heightScreen * 0.004,
                    marginBottom: heightScreen * 0.0085,
                    backgroundColor: '#FFFFFF',
                  }}
                />
              </View>
              <Text
                style={{
                  width: widthScreen * 0.469,
                  height: heightScreen * 0.051,
                  color: '#333333',
                  lineHeight: heightScreen * 0.025,
                  fontSize: heightScreen * 0.017,
                  marginTop: heightScreen * 0.008,
                  marginLeft: widthScreen * 0.051,
                }}>
                {this.props.title}的提案文档.doc
              </Text>
            </View>
            <View
              style={{
                width: widthScreen * 0.72,
                flexDirection: 'row',
                marginTop: heightScreen * 0.009,
                justifyContent: 'space-between',
              }}>
              <Text
                style={{
                  marginLeft: widthScreen * 0.018,
                  color: '#3399FF',
                  fontSize: heightScreen * 0.015,
                  //fontFamily: 'MicrosoftYaHei',
                }}>
                上传人：{this.props.launchName}
              </Text>
              <Text
                style={{
                  marginRight: widthScreen * 0.018,
                  color: '#3399FF',
                  fontSize: heightScreen * 0.015,
                  //fontFamily: 'MicrosoftYaHei',
                }}>
                点击可下载文档查看
              </Text>
            </View>
          </View>
        </TouchableOpacity>
        <View style={{height: heightScreen * 0.03}} />
        <View
          style={{
            marginLeft: widthScreen * 0.05,
            marginRight: widthScreen * 0.05,
            flexDirection: 'row',
            justifyContent: 'space-between',
            height: heightScreen * 0.042,
          }}>
          <View style={{flexDirection: 'row', alignItems: 'center'}}>
            <Text
              style={{
                marginTop: heightScreen * 0.004,
                color: '#3399FF',
                fontSize: heightScreen * 0.017,
                //fontFamily: 'MicrosoftYaHei',
              }}>
              提案终止期限：
            </Text>
            <Text
              style={{
                marginTop: heightScreen * 0.004,
                color: '#333333',
                fontSize: heightScreen * 0.017,
                //fontFamily: 'MicrosoftYaHei',
              }}>
              {this.props.deadline}
            </Text>
          </View>
          <View style={{flexDirection: 'row', alignItems: 'center'}}>
            <Text
              style={{
                marginTop: heightScreen * 0.004,
                color: '#3399FF',
                fontSize: heightScreen * 0.017,
                //fontFamily: 'MicrosoftYaHei',
              }}>
              提案人：
            </Text>
            <Avatar
              marginRight={widthScreen * 0.02}
              uid={this.props.proposerUID}
              pictureUrl={this.props.proposerAvatarUrl}
              pressFunc={() => this.jumpToOtherInfo(this.props.proposerUID)}
            />
          </View>
          <View style={{flexDirection: 'row', alignItems: 'center'}}>
            <Text
              style={{
                marginTop: heightScreen * 0.004,
                color: '#3399FF',
                fontSize: heightScreen * 0.017,
                //fontFamily: 'MicrosoftYaHei',
              }}>
              执行人：
            </Text>
            <Avatar
              marginRight={widthScreen * 0.02}
              uid={this.props.executorUid}
              pictureUrl={this.props.executorAvatarUrl}
              pressFunc={() => this.jumpToOtherInfo(this.props.executorUid)}
            />
          </View>
        </View>
      </View>
    );
  }
}
